<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <!-- BEGIN GLOBAL MANDATORY STYLES -->

    <!-- BEGIN GLOBAL MANDATORY STYLES -->
    <#include "../inc/list.ftl"/>
    <@list/>
</head>
<body >
<div class="panel panel-default">
    <div class="panel-body">
        <div class="row">
            <div class="col-lg-12">
                <div class="panel panel-default">
                <div class="panel-body">
                    <table width="100%" class="table table-striped table-bordered table-hover" id="list">
                        <thead>
                        <tr>
                            <th>ID</th>
                            <th>订单ID</th>
                            <th>服装名</th>
                            <th>价格</th>
                            <th>数量</th>
                            <th>总价格</th>
                        </tr>
                        </thead>
                        <tbody>
                        </tbody>
                    </table>


                    <div style="text-align:center;height:50px;line-height:50px;">
                        <select id="discount"  name="discount"  class="form-control" ></select>
                        <button id="addBill" class="btn btn-success">结算订单</button>
                    </div>
                </div>
                </div>
            </div>
        </div>
    </div>
    <!-- /.panel-body -->
</div>
<!-- /.panel -->
<script>
    $(document).ready(function() {
        var id = ${(id)!};
        var pay =${(pay)!};
        var table = $('#list').DataTable({
            "ajax": '/order/listDetail/'+id,
            "language": {
                "url": "/vendor/datatables/i18n/Chinese.json"
            },
            "columns": [
                {"data": "id","visible" : false},
                {"data": "orderid"},
                {"data": "clothing"},
                {"data": "price"},
                {"data": "number"},
                {"data": "sumprice"}
            ],
            responsive: true,
            select: true //datatables select 插件
        });
        initSelector1();

        $("#addBill").click(function(){
            if(pay==0){
                parent.layer.msg("操作无效，已支付，不能重复支付", {time: 2000, icon:2});
                var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                parent.layer.close(index);
            }
            else{
            var discount = $.trim($("#discount").val());
            var id = ${(id)!};
                var data1= {};
                data1.orderId = id;
                data1.discount = discount;
                $.ajax({
                    type:"POST",
                    url:"/bill/save",  //接口
                    data:JSON.stringify(data1),
                    contentType: "application/json",
                    success:function(data){
                        if(data.result){
                            parent.layer.msg(data.msg, {time: 1000, icon:1});
                        }else{
                            parent.layer.msg(data.msg, {time: 1000, icon:2});
                        }
                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
                        parent.layer.close(index);
                    }
                });
            }
        });
    });
    function initSelector1(){
        var selector1=  $("#discount");
        //freemarker遍历用法
        selector1.append("<option value='0'>不打折</option>");
            <#list discount as t>
                var discount="${t.discount}";
                var id = "${t.id}";
                selector1.append("<option value='"+id+"'>"+discount+"</option>");
            </#list>

    }

</script>
</body>

</html>